<template>
  <el-button
    :loading="loading"
    :type="val.buttonType"
    :plain="val.isPlain==='true'"
    :round="val.isRound==='true'"
    :style="{
          width: val.w + 'px',
          height: val.h + 'px',
          fontSize: val.fontSize+'px',
          color: val.color,
          backgroundColor: val.backgroundColor
       }">{{val.text}}
  </el-button>
</template>
<script>
  import StylePane from './style.vue'
  import dataMixin from '../mixins/data';

  const NAME = 'vpd-button';
  export default {
    mixins: [dataMixin],
    name: NAME,
    icon: 'vpd-button',
    title: '按钮',
    panel: StylePane,
    setting: {
      type: NAME,
      buttonType: 'primary',
      isPlain: 'false',
      isRound: 'false',
      x: 0,
      y: 0,
      w: 80,
      h: 33,
      minWidth: 20,
      minHeight: 20,
      text: '按钮',
      fontSize: 12,
      color: null,
      backgroundColor: null
    },
    props: {
      val: {
        type: Object
      }
    },
    data() {
      return {
        data: ''
      }
    },
    computed: {},
    methods: {
      updateData(data) {
        this.data = data;
      }
    }
  }
</script>
<style scoped>
  .text {
    word-break: break-all;
  }
</style>
